<%@ page import="com.github.pagehelper.PageInfo" %><%--
  Created by IntelliJ IDEA.
  User: asus
  Date: 2019/8/31
  Time: 21:44
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>展示用户信息</title>
    <!--导入bootstrap框架-->
    <!--导入bootstrap框架-->
    <link href="${pageContext.request.contextPath}/css/bootstrap.min.css" rel="stylesheet">
    <link href="$${pageContext.request.contextPath}/css/index.css" rel="stylesheet">
    <script src="${pageContext.request.contextPath}/js/jquery-3.2.1.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/owl.carousel.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/jquery.mixitup.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/jquery.fancybox.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/jquery.counterup.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/waypoints.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/jquery.magnific-popup.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/countdown.js"></script>
    <script src="${pageContext.request.contextPath}/js/script.js"></script>

</head>
<style>
    .first_td {
        /*border: 1px solid;*/
        text-align: center;
        font-size: 16px;
        /*color: white;*/
        /*font-family: 楷体;*/
    }
    .lt {
        text-align: center;
        margin-top: 80px;

    }
    #history{
        width: 85%;
        text-align: center;
        margin-top: 30px;
    }
    #his_btn{
        float: right;
        margin-right: 200px;

    }
    #title{
        font-size: 32px;
        /*color: white;*/
    }
    #uls{
        margin-left: 130px;
    }
</style>
<script>
    function find() {
        location.href = "${pageContext.request.contextPath}/client/findHis"
    }
</script>
<body>
<div style="height: 600px">
    <div class="lt">
        <h3 id="title">入住用户展示列表</h3>
    </div>

        <span>
            <button id="his_btn" onclick="find()" type="button" class="btn btn-default navbar-btn" >查看历史客户</button>
        </span>

    <div align="center">
        <table class="table table-hover" id="history" >
            <tr>
                <th class="first_td">用户编号</th>
                <th class="first_td">用户姓名</th>
                <th class="first_td">身份证号</th>
                <th class="first_td">入住日期</th>
                <th class="first_td">退房日期</th>
            </tr>
            <c:forEach items="${clientList}" var="client" varStatus="vs">
                <tr>
                    <td class="first_td">${vs.count}</td>
                    <td class="first_td">${client.clientName}</td>
                    <td class="first_td">${client.clientIdcard}</td>
                    <td class="first_td">${client.clientDate}</td>
                    <td class="first_td">${client.clientEndtime}</td>
                </tr>
            </c:forEach>
        </table>
    </div>
    <%-- <div class="row">
         <div class="col-sm-6 col-md-4">
             <div class="thumbnail">
                 <img src="${pageContext.request.contextPath}/images/jiudian.jpg" alt="...">
                 <div class="caption">
                     <h3>Thumbnail label</h3>
                     <p>...</p>
                     <p><a href="#" class="btn btn-primary" role="button">Button</a> <a href="#" class="btn btn-default"
                                                                                        role="button">Button</a></p>
                 </div>
             </div>
         </div>
     </div>--%>
    <%--<script>
        var uls = "";
        uls += '<li>\n' +
            '            <a href="#" aria-label="Previous">\n' +
            '                <span aria-hidden="true">&laquo;</span>\n' +
            '            </a>\n' +
            '        </li>';
        <c:forEach items="${clientList}" var="client" varStatus="vs">
        uls += '<li><a href="#">1</a></li>';
        </c:forEach>
        uls+='<li>\n' +
            '            <a href="#" aria-label="Next">\n' +
            '                <span aria-hidden="true">&raquo;</span>\n' +
            '            </a>\n' +
            '        </li>';

        uls+='<span><font size="5">共有10位客户,共2页</font></span>';
        $("#uls").html(uls)
    </script>--%>
</div>
</body>
<%--分页--%>
<nav aria-label="Page navigation">
    <ul class="pagination" id="uls">
        <li>
            <a href=${pageContext.request.contextPath}/client/findAll?currentPage=${pageInfo.prePage}&rows=5 aria-label="Previous">
                <span aria-hidden="true">&laquo;</span>
            </a>
        </li>
       <%-- <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li><a href="#">4</a></li>--%>
        <c:forEach begin="1" end="${pageInfo.pages}" var="i">
            <c:if test="${pageInfo.pageNum==i}" >
                <li  class="active"><a href=${pageContext.request.contextPath}/client/findAll?currentPage=${i}&rows=5>${i}</a></li>
            </c:if>
            <c:if test="${pageInfo.pageNum!=i}" >
                <li><a href=${pageContext.request.contextPath}/client/findAll?currentPage=${i}&rows=5>${i}</a></li>
            </c:if>
        </c:forEach>
        <li>
            <a href=${pageContext.request.contextPath}/client/findAll?currentPage=${pageInfo.nextPage}&rows=5 aria-label="Next">
                <span aria-hidden="true">&raquo;</span>
            </a>
        </li>
        <span><font size="5">共有${pageInfo.endRow}位客户,共${pageInfo.pages}页</font></span>
    </ul>
</nav>
</html>
